﻿@{
    Layout = "_Layout";
    ViewData["Title"] = "入库管理";
}

<el-container>
    <avue-crud :data="tableData" :option="option" :permission="hasPermission" :page.sync="pageOption" :table-loading="loading"
               v-on:refresh-change="refreshChange"
               v-on:row-save="handleRowSave"
               v-on:search-change="searchChange"
               v-on:search-reset="resetChange"
               v-on:on-load="onLoad">
        <template slot="productInfo" slot-scope="scope">
            <div>
                <div>{{scope.row.productName}} ({{scope.row.productCode}})</div>
                <div style="color: #909399; font-size: 12px">{{scope.row.productSpec}}</div>
            </div>
        </template>
        <template slot="menu" slot-scope="scope">
            <el-button type="text" icon="el-icon-document" size="small"
                       @@click ="handlePrint(scope.row)" v-if="hasPermission('stockIn:print')">
                {{i18n.t('打印')}}
            </el-button>
        </template>
    </avue-crud>
</el-container>

@section Scripts {
    <script>
        new Vue({
            el: '#app',
            mixins: [curdMixin],
            data() {
                return {
                    name: "stockIn",
                    pageUrl: `/inventory/stockIn/pages`,
                    addUrl: `/inventory/stockIn/add`,

                    option: {
                        searchShowBtn: Permissions.avePermission(`stockIn:searchBtn`),
                        refreshBtn: Permissions.avePermission(`stockIn:searchBtn`),
                        menuWidth: '200',
                        rowKey: 'id',
                        searchShow: true,
                        addBtn: Permissions.avePermission(`stockIn:add`),
                        editBtn: false,
                        delBtn: false,
                        column: [
                            { prop: "id", label: `${this.i18n.t('primary_key')}`, search: false, hide: true, type: "number", display: false, showColumn: false },
                            { prop: "inDate", label: `${this.i18n.t('入库日期')}`, type: "date", width: '120',format: "yyyy-MM-dd", valueFormat: "yyyy-MM-dd", searchRange: true,rules: [{ required: true, trigger: "blur", message: `${this.i18n.t('pleaseenter')}` }],  },
                            { prop: "productId", label: `${this.i18n.t('产品信息')}`, hide: false,type:'select', search: true,dicUrl: "/product/list", props: { label: "productName", value: "id" },rules: [{ required: true, trigger: "blur", message: `${this.i18n.t('pleaseenter')}` }],  },
                            // { prop: "productInfo", label:`${this.i18n.t('产品信息')}, slot: true, width: '200' },
                            { prop: "quantity", label: `${this.i18n.t('入库数量')}`, type: "number", min: 1,  rules: [{ required: true, message: `${this.i18n.t('请输入入库数量')}`, trigger: 'blur' }] },
                            { prop: "operator", label: `${this.i18n.t('操作人')}`,hide: false,edit:false,   readonly:true,disabled:true, },
                            { prop: "remark", label: `${this.i18n.t('备注')}`, hide: false, type: 'textarea', span: 24 }
                        ],
                    },
                }
            },
            methods: {
                handlePrint(row) {
                    // 打印入库单逻辑
                    console.log('打印入库单:', row);
                },
                // handleRowSave(row, done, loading) {
     
                //     this.$axios.post(this.addUrl, row).then(res => {
                //         this.$message.success('入库成功');
                //         this.refreshChange();
                //         done();
                //     }).catch(err => {
                //         loading();
                //     });
                // }
            }
        });
    </script>
}